@using BlazorApp.Pages.Common
@using Extension.k8s
@using k8s.Models
@inherits BlazorApp.Pages.Common.PageBase

<div>
    <GridRow Class="grid-table ">
        <GridCol Span="4">
            <Tooltip ArrowPointAtCenter="true" Title="@($"{L["Metrics"]} {L["Detail"]}")">
                <Icon OnClick="() => OnNodeMetricsClick(Node)" Type="dashboard" Theme="twotone" TwotoneColor="#106ebe"
                      Height="20px" Width="20px"/>
            </Tooltip>
        </GridCol>
        <GridCol Span="10">
            <MetricView ResourceType="Node" ItemName="@Node.Name()" MetricType="cpu"></MetricView>
        </GridCol>
        <GridCol Span="10">
            <MetricView ResourceType="Node" ItemName="@Node.Name()" MetricType="memory"></MetricView>
        </GridCol>
    </GridRow>
    <GridRow Class="grid-table ">
        <GridCol Span="24">
            <NodeStatusBulletChart Node="@Node"></NodeStatusBulletChart>
        </GridCol>
    </GridRow>
    <GridRow Class="grid-table ">
        <GridCol Span="24">
            <Space Size="@("4")" Wrap>
                @foreach (var pod in podsOnNode)
                {
                    <SpaceItem>
                        <Tooltip ArrowPointAtCenter="true">
                            <TitleTemplate>
                                <Text Style="color: white">@pod.Name() @pod.Status()</Text>
                            </TitleTemplate>
                            <ChildContent>
                                @switch (pod.Status())
                                {
                                    case "Running":
                                        <Icon Type="play-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone" TwotoneColor="#0f9b0f" Height="20px" Width="20px"/>
                                        break;
                                    case "Terminating":
                                        <Icon Type="minus-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone"
                                              TwotoneColor="#a19f9d" Height="20px" Width="20px"/>
                                        break;
                                    case "Pending":
                                        <Icon Type="play-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone"
                                              TwotoneColor="#ff8c00" Height="20px" Width="20px"/>
                                        break;
                                    case "Completed":
                                        <Icon Type="play-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone"
                                              TwotoneColor="#e1dfdd" Height="20px" Width="20px"/>
                                        break;
                                    case "CrashLoopBackOff":
                                        <Icon Type="close-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone"
                                              TwotoneColor="#d83b01" Height="20px" Width="20px"/>
                                        break;
                                    case "error":
                                        <Icon Type="minus-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone"
                                              TwotoneColor="#ffb900" Height="20px" Width="20px"/>
                                        break;
                                    default:
                                        <Icon Type="minus-square" OnClick="@(() => OnPodClick(pod))" Theme="twotone"
                                              TwotoneColor="#a8071a" Height="20px" Width="20px"/>
                                        break;
                                }
                            </ChildContent>
                        </Tooltip>
                    </SpaceItem>
                }
            </Space>
        </GridCol>
    </GridRow>
</div>
